<div class = "field-item-container ui dropdown ml5 pr5" draggable = "true" style = "border:1px solid #ccc;box-shadow: 0 2px 3px 0 rgba(34,36,38,.15);z-index: 101;">
    <div class = "text" ng-click = "select($event)">
        <b>{{ menu.columnDesc }}</b>
        <b ng-if = "menu.fieldType != 'condition'">{{ menu.meaType != 'group' ? "(" + meaTypeNames[menu.meaType] +')' : '' }}</b>
    </div>
    <i class = "dropdown icon" ng-click = "select($event)"></i>
    <div class = "menu">
        <div class = "item" ng-repeat = "submenu1 in menu.submenus" ng-if = "submenu1.name" ng-hide = "submenu1.hide" ng-click = "submenu1.fn && submenu1.fn(menu.fieldType,menu.columnId)">
            <i class = "dropdown icon" ng-if = "submenu1.submenus.length"></i>
            <span>{{submenu1.name}}</span>
            <div class = "menu" ng-if = "submenu1.submenus.length">
                <div class = "item" ng-repeat = "submenu2 in submenu1.submenus" ng-click = "submenu2.fn && submenu2.fn(menu.fieldType,menu.columnId)">
                    <i class = "dropdown icon" ng-if = "submenu2.submenus.length"></i>
                    <span>{{submenu2.name}}</span>
                    <div class = "menu" ng-if = "submenu2.submenus.length">
                        <div class = "item" ng-repeat = "submenu3 in submenu2.submenus" ng-click = "submenu3.fn && submenu3.fn(menu.fieldType,menu.columnId)">
                            <span>{{submenu3.name}}</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>